<template>
  <CHeader fixed class="m_header" id="m_header" v-on:mouseover="overShow">
    <CNavbar expandable="sm" color="faded" light class="navbarstyle">
      <CToggler in-navbar @click="collapsed = !collapsed" />
      <!--图标-->
      <CNavbarBrand href="#">
        <div class="brand_title" style="width: 480px">
          <div class="logoClass">
            <img
              :src="this.$store.state.homeIcon"
              alt
              class="imgSty"
              style="margin-right: 17px; height: 100%"
            />
          </div>

          <!--<img
            src="../assets/icons/log_piecloud.png"
            alt
            class="imgSty"
            style="width: 190px;height: auto;margin-right: 17px;"
          />-->
          <div>
            <!-- <div class="name">{{secondTitle}}</div>  -->
            <!-- start暂时注释 两级标题 -->
            <!-- <div class="headline">{{this.$store.state.firstTitle}}</div>
            <div
              class="name"
              v-if="this.$store.state.secondTitleStatious"
            >{{this.$store.state.secondTitle}}</div>-->

            <!-- end暂时注释 两级标题 -->
            <div id="headline">
              {{
                this.$store.state.secondTitleStatious
                  ? this.$store.state.secondTitle
                  : this.$store.state.firstTitle
              }}
            </div>
          </div>
        </div>
      </CNavbarBrand>
      <!--内容-->
      <CCollapse :show="collapsed" navbar>
        <CNavbarNav class="mr-4">
          <CHeaderNavItem
            v-for="(item, index) in navHeaderMenuList"
            :key="index"
            :title="item.name"
            class="px-3"
            style="background: rgba(0, 0, 0, 0)"
            :id="item.name"
            :class="{ active_tab: currentPath == getCurrent(item, index) }"
          >
            <div @click="navHeaderSwitch(item)" class="titleItem">
              <img
                :src="getImg(item.icon, index)"
                alt
                class="commonbg"
                style="
                  height: 18px;
                  width: 18px;
                  background: rgba(0, 0, 0, 0);
                  margin-top: 0;
                  margin-right: 5px;
                "
              />
              <p class="pstyle" style="background: rgba(0, 0, 0, 0)">
                {{ item.name }}
              </p>
            </div>
          </CHeaderNavItem>
        </CNavbarNav>
      </CCollapse>
      <!--头像-->
      <CNavbarNav class="ml-auto">
        <CDropdown class="CDropdownstyle">
          <template #toggler>
            <div @click="showAdmin" class="adminBtn">
              <div
                style="
                  background: rgba(0, 0, 0, 0.43);
                  width: 258px;
                  height: 200px;
                  position: absolute;
                  z-index: -1;
                  left: -38px;
                  transform: rotate(-66deg);
                "
              ></div>
              <img src="@/assets/icons/admin.png" alt class="svgsize" />
              <p style="margin-top: -2px">{{ nickName ? nickName : "游客" }}</p>
            </div>
          </template>

          <CDropdownItem
            v-if="userlogin == 'Tourist' ? false : true"
            download="用户使用手册.pdf"
            href="./pdf/用户使用手册.pdf"
          >
            <span>
              <img src="../assets/icons/help.svg" class="hradericon" alt />
              <p class="itemstyle">用户手册</p>
            </span>
          </CDropdownItem>

          <CDropdownItem
            v-if="userlogin == 'Tourist' ? false : true"
            download="问题记录.pdf"
            href="./pdf/问题记录.pdf"
          >
            <span>
              <img src="../assets/icons/help.svg" class="hradericon" alt />
              <p class="itemstyle">FAQ</p>
            </span>
          </CDropdownItem>

          <!--          <CDropdownItem
            v-if="userlogin == 'Tourist' ? false : true"
            download="数据处理系统精度测试报告.pdf"
            href="./pdf/数据处理系统精度测试报告.pdf"
          >
            <span>
              <img src="../assets/icons/baogao.svg" class="hradericon" alt />
              <p class="itemstyle">精度报告</p>
            </span>
          </CDropdownItem>

          <CDropdownItem
            v-if="userlogin == 'Tourist' ? false : true"
            download="数据处理系统分布式存储测试报告.pdf"
            href="./pdf/数据处理系统分布式存储测试报告.pdf"
          >
            <span>
              <img src="../assets/icons/xingneng.svg" class="hradericon" alt />
              <p class="itemstyle">性能报告</p>
            </span>
          </CDropdownItem>-->

          <!-- <Poptip placement="right" trigger="hover">
            <CDropdownItem
              v-if="userlogin == 'Tourist' ? false : true"
              download="操作视频.rar"
              href="#"
            >
              <span>
                <img
                  src="../assets/icons/xingneng.svg"
                  class="hradericon"
                  alt
                />
                <p class="itemstyle">操作视频</p>
              </span>
            </CDropdownItem>
            <div class="api" slot="content">
              <div @click="openVideoOne" style="cursor: pointer">
                基础操作教程
              </div>
              <div
                style="margin-top: 5px; cursor: pointer"
                @click="openVideoTwo"
              >
                高级操作教程
              </div>
            </div>
          </Poptip> -->

          <CDropdownItem
            v-if="userlogin == 'Tourist' ? false : true"
            @click="changeUser"
          >
            <span>
              <img src="../assets/icons/mima.svg" class="hradericon" alt />
              <p class="itemstyle">个人信息</p>
            </span>
          </CDropdownItem>

          <CDropdownItem
            v-if="userlogin == 'Tourist' ? false : true"
            @click="changePwd"
          >
            <span>
              <img src="../assets/icons/mima.svg" class="hradericon" alt />
              <p class="itemstyle">修改密码</p>
            </span>
          </CDropdownItem>

          <CDropdownItem
            v-if="userlogin == 'Tourist' ? false : true"
            @click="versionView"
          >
            <!-- <CIcon name="cil-lock-locked" /> -->
            <span>
              <img src="../assets/icons/mima.svg" class="hradericon" alt />
              <p class="itemstyle">版本查看</p>
            </span>
          </CDropdownItem>

          <CDropdownItem
            v-if="roleName == '管理员' ? true : false"
            target="_blank"
            :href="registered"
          >
            <span>
              <img src="../assets/icons/xingneng.svg" class="hradericon" alt />
              <p class="itemstyle">认证授权</p>
            </span>
          </CDropdownItem>
          <!-- <CDropdownItem
            v-if="userlogin == 'Tourist' ? false : true"
            :download="downloadFileName"
            :href="downloadFileHref"
          >
            <span>
              <img src="../assets/icons/baogao.svg" class="hradericon" alt />
              <p class="itemstyle">下载工具</p>
            </span>
          </CDropdownItem> -->
          <CDropdownItem
            v-if="userlogin == 'Tourist' ? false : true"
            @click="Logout"
          >
            <!-- <CIcon name="cil-account-logout" /> -->
            <span>
              <img src="../assets/icons/out.svg" class="hradericon" alt />
              <p class="itemstyle">退出登录</p>
            </span>
          </CDropdownItem>

          <CDropdownItem
            v-if="userlogin == 'Tourist' ? true : false"
            @click="Logout"
          >
            <span>
              <!-- <CIcon name="cil-account-logout" /> -->
              <img
                src="../assets/icons/Guestlogin.svg"
                class="hradericon"
                alt
              />
              <p class="itemstyle">登 录</p>
            </span>
          </CDropdownItem>
        </CDropdown>
      </CNavbarNav>
    </CNavbar>
    <!--修改密码-->
    <Modal v-model="show" title="修改密码" centered draggable scrollable>
      <CRow>
        <CCol md="12">
          <CForm>
            <CInput
              label="用户名"
              placeholder="请输入用户名"
              horizontal
              v-model="userData.username"
              readonly
            />
            <CInput
              label="旧密码"
              placeholder="请输入旧密码"
              horizontal
              type="password"
              v-model="userData.oldPwd"
            />
            <CInput
              label="新密码"
              placeholder="请输入至少6个字符,其中必须包含字母,数字"
              horizontal
              type="password"
              password
              v-model="userData.newPwd"
            />
            <CInput
              label="确认密码"
              placeholder="再次输入新密码"
              horizontal
              type="password"
              v-model="userData.conPwd"
            />
          </CForm>
        </CCol>
      </CRow>
      <template #footer class="footerBtns">
        <CButton @click="changeCancel" color="info" class="cancel-btn"
          >取消</CButton
        >
        <CButton @click="changeOk" color="info" class="system-btn-style"
          >确定</CButton
        >
      </template>
    </Modal>
    <!--查看版本-->
    <Modal
      v-model="versionShow"
      draggable
      scrollable
      title="版本查看"
      :styles="modalStyle"
    >
      <p slot="header" class="modalHeader">版本查看</p>
      <CButtonClose slot="close" @click="versionCancel" />
      <!-- <CRow>
        <span>是否进行系统维护</span>
        <CInputCheckbox
          label="维护系统中"
          type="radio"
          :checked.sync="isBatch"
          value="维护系统中"
        />
      </CRow>-->
      <!--<h5>当前版本：{{ this.versionInfo.versionNum }}</h5>-->
      <h5>当前版本：v2.0</h5>
      <h5>更新时间：{{ buildTime }}</h5>
      <h5>更新内容：</h5>
      <p v-for="(item, i) in this.versionInfo.contents" :key="i">
        {{ i + 1 }}. {{ item }}
      </p>
      <template #footer>
        <CButton @click="versionCancel" color="info" class="cancel-btn"
          >取消</CButton
        >
        <CButton @click="versionOk" color="info" class="system-btn-style"
          >确定</CButton
        >
      </template>
    </Modal>
    <!-- 修改个人信息 -->
    <Modal
      v-model="updateUserShow"
      title="修改个人信息"
      draggable
      scrollable
      :styles="modalStyle"
    >
      <p slot="header" class="modalHeader">修改个人信息</p>
      <CRow>
        <CCol md="12">
          <CForm>
            <CInput
              label="用户名"
              placeholder="请输入用户名"
              horizontal
              v-model="userData.username"
              minLenth="5"
              maxlength="50"
              readonly
            />
            <CInput
              label="用户昵称"
              placeholder="请输入用户昵称"
              horizontal
              v-model="userData.nickName"
            />
            <CInput
              label="手机号"
              placeholder="请输入手机号(可不填)"
              horizontal
              v-model="userData.mobile"
            />
          </CForm>
        </CCol>
      </CRow>
      <template #footer class="footerBtns">
        <CButton @click="updateUserCancel" color="info" class="cancel-btn"
          >取消</CButton
        >
        <CButton @click="updateUserOk" color="info" class="system-btn-style"
          >确定</CButton
        >
      </template>
    </Modal>
    <homeIcon v-if="false"></homeIcon>
  </CHeader>
</template>



<script>
import homeIcon from "@/views/systemManage/homeIcon";
import { mapActions, mapGetters } from "vuex";
export default {
  name: "TheHeader",
  components: {
    homeIcon,
  },
  data() {
    return {
      updateUserShow: false,

      downloadFileName: "",
      downloadFileHref: "",
      roleName:
        this.$store.state.user && this.$store.state.user.roleName
          ? this.$store.state.user.roleName[0]
          : "", //可能会有问题
      buildTime: buildTime, //最新的更新时间
      registered: registered,
      // 图标标题的动态获取start
      modalStyle: { top: "250px" },
      imgSty: "",
      homeIcon: "",
      firstTitle: "",
      secondTitle: "",
      secondTitleStatious: true,
      // end
      pngList: [
        { key: "home.svg" },
        { key: "processing.svg" },
        { key: "qualityCheck.svg" },
        { key: "task.svg" },
        { key: "around.svg" },
        { key: "model.svg" },
        { key: "setting.svg" },
      ],
      navHeaderMenuList: [], //导航内容
      currentUser: "",
      userlogin: "user",
      shadowSearch: "", //向父组件抛出msg的值
      collapsed: false,
      logo: false,
      nowDate: "",
      dataquery: false,
      showHomepage: false,
      check: false,
      task: false,
      monitor: false,
      model: false,
      catalogData: [], //同参数navHeaderMenuList
      userName: window.sessionStorage.getItem("user"),
      // nickName: window.sessionStorage.getItem("nickName"),
      mobile: window.sessionStorage.getItem("mobile"),
      /*  nickName: "",*/
      show: false,
      userData: {
        username: "",
        oldPwd: "",
        newPwd: "",
        conPwd: "",
        isMd5: false,
        systemId: systemId,
      },
      versionShow: false,
      versionInfo: {
        versionNum: "",
        updateTime: "",
        contents: [],
      },
    };
  },
  computed: {
    currentPath() {
      // return this.$route.path || "";
      let path = this.$route.path;
      let pathCurrent = path.split("/");
      let start = pathCurrent[1];
      let currentpath = "/" + start;
      return currentpath;
    },
    nickName() {
      let dataName;
      let userName =
        window.sessionStorage.getItem("user") || this.$store.state.user
          ? this.$store.state.user.userName
          : "";

      // let nickName = window.sessionStorage.getItem("nickName")
      // ? this.$store.state.user.nickName : this.$store.state.user  ? this.$store.state.user.nickName: "";

      let nickName = window.sessionStorage.getItem("nickName");
      nickName = nickName ? nickName : userName;

      /*      let userName =  window.sessionStorage.getItem("user") ;
      let nickName =window.sessionStorage.getItem("nickName");*/
      if (!userName) {
        this.userName = "游  客";
        dataName = "游  客";
        this.userlogin = "Tourist";
      } else {
        this.userName = userName;
        dataName = nickName;
      }
      return dataName;
    },
  },

  mounted() {
    this.getHomeIcon();
    this.nowDate = this.$moment().format("YYYY年MM月DD日");

    this.getCatalog();
    // this.getDownloadFileName();
    console.log(this.$store.state, "this.$store.state");
  },
  methods: {
    getTitleName() {
      return this.nickName;
    },

    getDownloadFileName() {
      let root = "./pdf/";
      let path = this.$api.manageApi.getByDictCode + "downloadFilePath";
      this.http.get(path).then((res) => {
        if (res.data.success && res.data.data) {
          if (res.data.data.length < 1) return;
          this.downloadFileHref = root + res.data.data[0].dictName;
          this.downloadFileName = "文件管理工具_" + res.data.data[0].dictName;
        } else {
          this.$Message.error(res.data.message);
        }
      });
    },
    /*    openVideoOne() {
      var page = window.open();
      let data = require("../../public/pdf/GF1.mp4");
      var html = `<!DOCTYPE html>
                  <html>
                    <head>
                        <title>初级教程</title>
                        <meta charset="utf-8"/>
                    </head>
                    <body style="padding: 20px;overflow: hidden">
                       <div style='width:85%;margin:auto;'> <video controls width='100%' autoplay src=${data}></video> </div>
                    </video>
                    </body>
                  </html>`;
      page.document.write(html);
    },
    openVideoTwo() {
      var page = window.open();
      let data = require("../../public/pdf/Modis.mp4");
      var html = `<!DOCTYPE html>
                  <html>
                    <head>
                        <title>初级教程</title>
                        <meta charset="utf-8"/>
                    </head>
                    <body style="padding: 20px;overflow: hidden">
                       <div style='width:85%;margin:auto;'> <video controls width='100%' autoplay src=${data}></video> </div>
                    </video>
                    </body>
                  </html>`;
      page.document.write(html);
    },*/

    //item的click事件
    navHeaderSwitch(item) {
      if (item.to === "/processing" || item.to === "/qualityCheck") {
        //控制左侧导航的搜索显示
        this.$store.commit("setHeaderSation", "yessearch");
      } else {
        //控制左侧导航的搜索显示
        this.$store.commit("setHeaderSation", "nosearch");
      }

      // this.$emit("searchinput", this.shadowSearch);
      this.switchNavData(item.to);
    },
    switchNavData(path) {
      let that = this;
      //禁止重复跳转
      if (this.$router.currentRoute.path === path) {
        return;
      }
      this.$router.replace(path);
      return false
      if (path.startsWith("/processing")) {
        that.getTreeList(2);
      } else if (path.startsWith("/qualityCheck")) {
        that.getTreeList(1);
      } else if (path.startsWith("/taskManage")) {
        that.getTaskCatalog(path);
      } else {
        for (let i = 0; i < that.catalogData.length; i++) {
          let item = that.catalogData[i]._children;
          if (that.catalogData[i].to == path) {
            if (item == undefined) {
              item = [];
            }
            for (let q = 0; q < item.length; q++) {
              if (item[q]._children == undefined) {
                continue;
              } else {
                // 遍历数组，添加icon
                that.getChildrenDataAddIcon(item[q]._children);
              }
            }
            //调用父组件方法更新左侧树
            this.$parent.refresh(item);
            break;
          }
        }
      }
    },

    // 任务中心左侧树taskManage
    getTaskCatalog(path) {
      if (path.startsWith("/taskManage")) {
        let path = this.$api.homeLoginOthers.queryTaskCatalog;
        let param = {
          userName: this.userName,
        };
        this.http.get(path, param).then((res) => {
          if (res.data.code == 0) {
            let dataList = res.data.data;
            //调用父组件方法更新组织机构树
            this.$parent.refresh(dataList);
          }
        });
      }
    },

    // 获取树结构 processing 和qualityCheck 更新左侧机构树
    getTreeList(groupId) {
      let _this = this;
      let path = this.$api.homeLoginOthers.workFlowGroup;
      let params = {
        groupId: groupId,
        systemId: systemId,
      };
      let urlPreSuffix = "/processing/common/"; //处理加工 默认
      if (groupId == 1) {
        //1、质检 2 处理加工
        urlPreSuffix = "/qualityCheck/common/";
      }
      this.http
        .get(path, params)
        .then((res) => {
          if (res.data.code == 0) {
            let list = res.data.data;
            for (var i = 0; i < list.length; i++) {
              let tempData = list[i];
              tempData.icon = "cil-settings";
              //处理一级
              _this.setTreeNodeRoute(list[i], urlPreSuffix);

              //处理二级
              let children = tempData.children;
              if (children == undefined || children == null) continue;
              for (let j = 0; j < children.length; j++) {
                _this.setTreeNodeRoute(children[j], urlPreSuffix);
              }

              tempData._children = children;
            }
            //调用父组件方法进行更新
            _this.$parent.refreshcolor(list, groupId);
          } else {
            _this.$Message.error(res.data.message);
          }
        })
        .catch((err) => {
          if (
            err.data.code === 401 &&
            err.data.message ===
              "Cluster Node count is more than authorize count"
          ) {
            that.$Message.error("授权已过期，请重新申请授权!");
          } else {
            that.$Message.error(err.data.message);
          }
        });
    },
    setTreeNodeRoute(node, urlPreSuffix) {
      node.name = node.title;
      if (node.children) {
        if (node.customLabel.toLowerCase() === "push") {
          node.to = node.url;
        }
        return;
      }
      if (node.children.length == 0) {
        node._name = "CSidebarNavItem";
        if (node.customLabel.toLowerCase() === "push") {
          //推送任务特殊处理
          node.to = node.url;
        } else {
          node.to = urlPreSuffix + node.customLabel + "/" + node.id;
        }
      } else {
        node._name = "CSidebarNavDropdown";
      }
    },

    //获取导航内容
    getCatalog() {
      let self = this;
      let path = this.$api.homeLoginOthers.getMyCatalog;
      let param = {
        systemId: systemId,
        type: 0,
        treeType: 3,
      };

      this.http.get(path, param).then((res) => {   
        if (res.data.success) {         
          //任务中心/减灾监测/添加HJ2A/B
          res.data.data.map((item)=>{
            if(item.id == 4 &&item._children.length !=0){
              item._children.map((item2)=>{
                if(item2.id== 384&&(item2.hasOwnProperty("_children")||item2._children.length !=0)){
                    let flag = item2._children.findIndex((item3) => {
                    return item3.name == "HJ2A/B数据匹配";                    
                  });
                  if (flag == -1) {
                  let obj = {
                    _name: "CSidebarNavItem",
                    name: "HJ2A/B数据匹配",
                    icon: "",
                    to: "/taskManage/TaskHJ2AB",
                  };
                  item2._children.push(obj);
                  }
                }
                
              })
            }
          })
          let tempData = res.data.data;
          
          //代码特殊控制导航栏一级目录显示
          tempData.forEach((ele, index) => {
            let fileterArr = ["/dataOptimization"]; //数据优选模块
            if (fileterArr.indexOf(ele.to) != -1) {
              tempData.splice(index, 1);
              index--;
            }
          });
          self.catalogData = tempData;
          self.navHeaderMenuList = tempData;
        } else {
          this.$Message.error(res.data.message);
        }
      });
    },

    //查看版本
    versionView() {
      let self = this;
      let path = this.$api.homeLoginOthers.getNewVersion;
      this.http.get(path).then((res) => {
        if (res.data.success) {
          let data = res.data.data;
          self.versionInfo.versionNum = data.version;
          self.versionInfo.updateTime = data.updateTime;
          self.versionInfo.contents = data.content.split(";");
        } else {
          this.$Message.error(res.data.message);
        }
      });
      this.versionShow = true;
    },
    //给与点击的item样式
    getCurrent(item) {
      let result = "";
      if (
        item.to === "/taskManage" ||
        item.to === "/monitor" ||
        item.to === "/model" ||
        item.to === "/manage"
      ) {
        result = item.to;
        // let children = item._children;
        // result = children[0].to;
      } else {
        let result1 = item.to;
        let result2 = result1.split("/");
        let start3 = result2[1];
        result = "/" + start3;
      }
      return result;
    },
    //item的图片
    getImg(icon, index) {
      let data;
      try {
        data = require("@/assets/icons/" + icon);
      } catch (e) {
        return;
      }
      if (data) {
        return data;
      }
    },

    //修改个人信息弹框赋值
    changeUser() {
      this.userData = {
        username: "",
        nickName: "",
        mobile: "",
      };

      this.updateUserShow = true;
      this.userData.username = this.userName;
      this.userData.nickName = this.nickName;
      this.userData.mobile = this.mobile;
    },
    updateUserOk() {
      // this.updateUserShow = false;
      let userId = window.sessionStorage.getItem("userId");
      let path = this.$api.manageApi.updateUser + userId;
      console.log(this.userData.nickName, "///");
      if (this.userData.nickName == "" || this.userData.nickName == null) {
        this.$Message.info("用户昵称不能为空");
        return;
      }
      let param = {
        applicationId: "",
        avatarPath: "",
        mobile: this.userData.mobile,
        nickname: this.userData.nickName,
        note: "",
        organizationId: 0,
        sex: 0,
        userCode: "",
        username: this.userData.username,
      };
      this.http.post(path, param).then((res) => {
        if (res.data.success) {
          this.$Message.success(res.data.message);
        } else {
          this.$Message.error(res.data.message);
        }
      });
      this.updateUserShow = false;
    },
    updateUserCancel() {
      this.updateUserShow = false;
    },

    //修改密码弹框赋值
    changePwd() {
      this.userData = {
        username: "",
        oldPwd: "",
        newPwd: "",
        conPwd: "",
        isMd5: false,
        systemId: systemId,
      };

      this.show = true;
      this.userData.username = this.userName;
    },
    //循环添加icon
    getChildrenDataAddIcon(data) {
      for (let i = 0; i < data.length; i++) {
        data[i].icon = "cil-arrow-thick-right";
      }
    },
    //登录/退出登录
    Logout() {
      let _this = this;
      if (productionOrEngine === "production") {
        let path = this.$api.homeLoginOthers.logout;
        this.http
          .get(path)
          .then((res) => {
            //移除当前用户登录信息
            if (this.userlogin == "Tourist") {
              let route = _this.$route.path;
              //记录当前路由地址,登录后跳转
              _this.$store.dispatch("setRoute", route);
            } else {
              _this.$store.dispatch("removeRoute");
            }
            _this.$store.dispatch("logout").then(() => {
              // _this.$router.push({ path: "/pages/login" });
              _this.$router.push({ name: "login" });
            });
          })
          .catch((err) => {});
      } else {
        _this.$store.dispatch("logout");
        window.location.href = engineLoginUrl;
      }
    },
    // 图标和标题的修改
    getHomeIcon() {
      this.$store.getters.getHomeIcon;
    },
    //点击头像弹出
    showAdmin() {
      this.showAdmin = !this.showAdmin;
    },
    //确定修改密码
    changeOk() {
      let _this = this;
      if (
        _this.userData.oldPwd == "" ||
        _this.userData.newPwd == "" ||
        _this.userData.conPwd == ""
      ) {
        this.$Message.warning("旧密码、新密码和确认密码不能为空");
        return;
      }

      if (_this.userData.newPwd != _this.userData.conPwd) {
        this.$Message.warning("新密码与确认密码不一致");
        return;
      }

      //old正则限制：至少8个字符，至少1个字母，1个数字和1个特殊字符
      // let oldvalue =
      //   "^(?=.*[A-Za-z])(?=.*\\d)(?=.*[$@$!%*#?&])[A-Za-z\\d$@$!%*#?&]{8,}$";
      let newValue = "^(?=.*[A-Za-z])(?=.*\\d)[A-Za-z\\d$@$!%*#?&]{6,}$"; //至少6位以上的数字和字母 特殊字符串可选
      let regExp = new RegExp(newValue);

      let result = regExp.test(this.userData.newPwd);
      if (result == false) {
        this.$Message.warning(
          "密码需要包含至少6个字符，必须同时包含字母、数字",
          3000
        );
        return;
      }

      let path = this.$api.homeLoginOthers.changePwd;
      let param = _this.userData;
      this.http
        .post(path, param)
        .then((res) => {
          if (res.data.success) {
            this.$Message.success(res.data.message + "，即将重新登录");
            setTimeout(function () {
              _this.$router.push({
                path: "/pages/login",
              });
              _this.$store.dispatch("logout"); //清除登录信息
            }, 1000);
            this.show = false;
          } else {
            this.$Message.error(res.data.message);
          }
        })
        .catch((err) => {});
    },
    //取消修改密码
    changeCancel() {
      this.show = false;
    },
    //查看版本确定
    versionOk() {
      this.versionShow = false;
    },
    //查看版本取消
    versionCancel() {
      this.versionShow = false;
    },

    //未使用
    overShow() {
      // console.log("hello");
    },
  },
};
</script>

<style lang="less" scoped>
.mr-4 .active_tab {
  background: rgba(255, 255, 255, 0.3) !important;
  border-bottom: 0;
}
.mr-4 {
  font-size: 16px;
  justify-content: flex-end;
  display: flex;
  width: 100%;
  margin-right: 0rem !important;
}

.px-3 {
  color: aliceblue;
  font-size: 12px !important;
  color: #fff;
  cursor: pointer;
  height: 60px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  display: flex;
  align-items: center;

  float: left;
  letter-spacing: 1px;
}
.pointer {
  cursor: pointer;
}
.brand_title {
  display: flex;
  align-items: center;
  width: 400px;
  width: 320px;
  min-width: 350px;

  border-radius: 30px;
  padding-left: 10px;
  height: 60px;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
}
.brand_title .name {
  font-size: 10px;
  letter-spacing: 0.34px;
  color: #fff;
  vertical-align: sub;
  letter-spacing: 2px;
  margin-bottom: 0px;
  margin-top: 4px;
}

.logoWarp {
  background: #fff;
  border: 3px solid #999;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;

  // width: 210px;//演示完成还50px
  width: 50px;
  height: 50px;
  margin-left: 20px;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-right: 20px;
  border-radius: 25px;
}
.px-3 div {
  text-align: center;

  height: 100%;
  padding: 5px 10px 0;
}

.m_header {
  height: 65px;
  display: flex;
  align-items: center;
  position: fixed !important;
}
.brand_title1 {
  align-items: center;
  width: 400px;
  display: none;
}

.px-3 {
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
}
.pstyle {
  font-size: 1rem;
}
@media screen and (max-width: 1366px) {
  .pstyle {
    font-size: 0.8rem;
  }
}

@media screen and (max-width: 1166px) {
  .pstyle {
    display: none;
  }
  .commonbg {
    margin-top: 20px;
  }
}
.brand_middle {
  display: flex;
}
.adminBtn {
  top: 17px;
  right: 0px;

  vertical-align: middle;
  width: 150px;
  text-align: center;
  color: #fff;
  cursor: pointer;
  overflow: hidden !important;
  position: relative;
  left: 0;
  top: 0;
  height: 60px;
  padding-top: 4px;
}
.adminBtn img {
  width: 24px;
  height: 24px;
  margin-top: 5px;
}
p {
  margin-bottom: 0px;
}
</style>
<style scoped lang="scss">
#m_header .dropdown-item {
  background-color: #fff;
}
#m_header .dropdown-menu {
  padding: 0;
}
/deep/.dropdown-menu .dropdown-item:hover {
  background-color: var(--hover-color, #cbe5f5) !important;
}
div,
img,
p {
  background: rgba(0, 0, 0, 0);
}
.navbar {
  padding: 0px;
}

/* */
.navbarstyle {
  height: 60px;
  width: 100%;
  background-color: white;
  background-image: linear-gradient(
    125deg,
    rgba(255, 255, 255, 1) 20%,
    var(--label-font-color, #5d8bc4) 75%,
    rgba(50, 75, 116, 1) 91.7%,
    var(--label-font-color, #5d8bc4) 91.7%,
    #9996ff 96%,
    rgba(166, 123, 255, 1) 100%
  );
}
.ml-auto .dropdown-menu {
  top: 7px !important;
}
.svgsize {
  height: 24px;
  width: 24px;
  background-color: var(--hover-color, #cbe5f5);
  border-radius: 50%;
}
.itemstyle {
  margin-left: 19px;
  display: inline-block;
  width: 60px;
  text-align-last: justify;
}
.hradericon {
  width: 16px;
  height: 16px;
}
.navheader {
  /* background: rgba(0,  0,  0,  0);*/
}
.logoClass {
  padding: 4px;
  overflow: hidden;
  height: 88%;
  box-sizing: border-box;
  margin-left: 15px;
}

#headline {
  color: rgb(80, 79, 79);
  font-size: 25px;
  position: relative;
  top: 4px;
  background: linear-gradient(
    45deg,
    var(--label-font-color, #5d8bc4),
    #a874ff 35%,
    #9996ff 75%,
    rgb(166, 123, 255)
  );
  background-image: -webkit-linear-gradient(
    left,
    var(--label-font-color, #5d8bc4),
    #a874ff 35%,
    #9996ff 75%,
    rgb(166, 123, 255)
  );
  background-size: 200%, 100%;
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
}
.titleItem {
  display: flex;
  align-items: center;
  justify-content: center;
}

/deep/ .c-header-nav-item {
  padding: 0 !important;
}
/deep/.c-header-nav-item :hover {
  background: rgba(255, 255, 255, 0.3);
}

/deep/.navbar-collapse {
  margin-right: 35px;
}
</style>
